{extends file="../home.html"}
{block name="title"}{$head_title}{/block}
{block name="css"}
<link rel="stylesheet" type="text/css" href="__PUBLIC__/Css/front/front_css/refresh_load.css?version={$version}"/>
<style type="text/css">
    body{
    	padding-top:2.2rem;
    }
    #load_wrapper{
    	top:2.2rem;
    }
</style>
{/block}
{block name="content"}
<div class="service_header">
    <i class="icon icon_back_default3x mui-action-back" onclick="return_last_page();" style="top:.7rem"></i>
    <span class="mui-action-back" onclick="return_last_page();">返回</span>
    <p>众创空间</p>
    <a href="/FrontIncubator/search/from/zhongchuang" class="icon icon_search3x"></a>
</div>
<div id="load_wrapper">
<div id="scroller">
<div id="pullDown">
    <span class="pullDownIcon"></span>
</div>
<!--<div class="more_block" style="padding-bottom:0;">
    <div class="clearfix block_title">
        <h6 class="fl">热门资讯</h6>
        <a href="/FrontInformation/information_list" class="fr clearfix more_a">
            <span class="fl">查看更多</span>
            <i class="icon fr icon_enter_default3x"></i>
        </a>
    </div>
    <ul class="home_news">
        {foreach from=$information_list item=information}
        <li>
            <a href="/FrontInformation/information_detail/information_id/{$information.article_id}" class="clearfix">
                <div class="cont_time fl">
                    <p>{$information.title}</p>
                    <span>{'Y-m-d'|date:$information.addtime}</span>
                </div>
                <img src="{$information.path_img}" alt="" class="fr" />
            </a>
        </li>
        {/foreach}
    </ul>
</div>-->
<div class="park_box">
    <div class="scroller_box clearfix">
        <h6 class="fl" style="display:none;">切换城市</h6>
       <!-- <p class="fl" style="display:none;"></p>-->
        <div id="wrapper_list" class="fl" style="display:block;">
            <div id="scroller_list">
                <ul class="clearfix mall_list_tab">
                    <li class="fl sort_tab_active" cityid=0>
                        <a href="javascript:;" class="city" cityid=0 >全部</a>
                    </li>
                    {foreach from=$city_list item=city key=key}
                    <li class="fl" cityid="{$key}">
                        <a href="javascript:;" cityid={$key} class="city">{$city.city_name}</a>
                    </li>
                    {/foreach}
                    <!--<li class="fl zz">
                        <a href="javascript:;">上啊海</a>
                    </li>
                    <li class="fl">
                    <a href="javascript:;">深啊圳</a>
                    </li>
                    <li class="fl">
                    <a href="javascript:;">杭州</a>
                    </li>
                    <li class="fl">
                    <a href="javascript:;">武汉</a>
                    </li>
                    <li class="fl">
                    <a href="javascript:;">南京</a>
                    </li>
                    <li class="fl">
                    <a href="javascript:;">苏州</a>
                    </li>-->
                </ul>
            </div>
        </div>
        <i class="fr icon icon_shaixuan_default3x"></i>
        <ul class="city_list clearfix" style="display:none;">
            {foreach from=$city_list item=city key=key}
            <li class="fl" class="city" cityid="{$key}">{$city.city_name}</li>
            {/foreach}
            <!--<li class="fl">杭州</li>
            <li class="fl">上海</li>
            <li class="fl">南京</li>
            <li class="fl">广州</li>
            <li class="fl">武汉</li>
            <li class="fl">合肥</li>
            <li class="fl">张家界</li>
            <li class="fl">乌鲁木齐</li>
            <li class="fl">郑州</li>
            <li class="fl">无锡</li>
            <li class="fl">东莞</li>-->
        </ul>
        <!--<div class="city_list_bg" style="display:none;"></div>-->
    </div>
    <ul class="park_list">
        {foreach from=$zckj_list item=zckj}
        <li>
            <a href="/FrontIncubator/zhongchuang_detail/incubator_id/{$zckj.incubator_id}">
                <img src="{$zckj.first_pic}" alt="" />
                <div class="park_number clearfix">
                    <h6 class="fl">{$zckj.incubator_name}</h6>
                    <span class="fr">{if $zckj.station_left_num==null}0{else}{$zckj.station_left_num}{/if}个</span>
                    <p class="fr">剩余量：</p>
                </div>
                <p class="txt_limit">{$zckj.address}</p>
            </a>

           <!-- <a href="">
                <img src="/Public/Images/front/front_img/service_fws_pic3x.png" alt="" />
                <div class="park_number clearfix">
                    <h6 class="fl">银江孵化器·海创园区</h6>
                    <span class="fr">5个</span>
                    <p class="fr">剩余量：</p>
                </div>
                <p>浙江省杭州市余杭区文一西路1001号</p>
            </a>-->
        </li>
        {/foreach}
    </ul>
</div>
<div id="pullUp">
    <span class="pullUpIcon"></span><span class="pullUpLabel">上拉加载...</span>
</div>
</div>
</div>
<div class="city_list_bg" style="display:none;"></div>
{/block}
{block name="js"}
<script>
    var firstRow={$firstRow};
    var total={$total};
    var key_words='{$key_words}';
    var city_id='';
</script>
{literal}
 <script type="text/javascript" src="__PUBLIC__/Js/front/iscroll.js"></script> 
<script type="text/javascript" src="__PUBLIC__/Js/front/front_js/iscroll_tab.js"></script>
        <script type="text/javascript">
            window.onload = function(){
		       	 var a = 0;
		       	$(".mall_list_tab li").each(function(){
		            var w = $(this).width();
		            a += w;
		            var w2=$(".icon_shaixuan_default3x").width();
		            $("#scroller_list").width(a+w2);
	        	});
   			}
            $(function()
            {
              /*  $(".service_header i,.service_header span").on("click",function()
                {
                    history.go(-1);
                    //window.location='/FrontIndex/home_index';
                });*/
				//点击加号
                $(".scroller_box i").on("click",function()
                {
                   clickChange($(this));
                });
                
                //点击加号的方法
                function clickChange(obj){
                	obj.toggleClass('icon_close_default3x').toggleClass('icon_shaixuan_default3x');
                    $("#wrapper_list").toggle();
                    $(".scroller_box>h6").toggle();
                    $(".city_list").toggle();
                    $(".scroller_box p").css("display","none");
//                  var h = $(window).height() - [$(".scroller_box").height() + $(".scroller_box").offset().top-$(document).scrollTop()];
					
					var t = $(".scroller_box").height() + $(".service_header").height() + $(".city_list").innerHeight();
					var h = $(window).height() - t + 2;
                    $(".city_list_bg").height(h);
                   
                    $(".city_list_bg").toggle();
                    $("html,body").toggleClass("body_scroll");
                }
                $(".city_list li").on("click",function()
                {	
                	
                    $(this).addClass('active').siblings().removeClass('active');
                    var cityId = $(this).attr("cityid");
                  	var chooseCity = $(".mall_list_tab a[cityid = "+cityId+"]");
                  	chooseCity.parent().addClass("sort_tab_active")
                  	.siblings().removeClass('sort_tab_active');
                  	
                  	//调用点击加号的方法
					clickChange($(".scroller_box i"));
					
                  	//点击加号里面的城市切换，调用ajax加载
					chooseCityName(cityId);
                   
                    var txt = $(this).html();
                    $(".scroller_box p").show();
                    $(".scroller_box p").html(txt);
                    /*$(".city_list").toggle();
                    $(".scroller_box i").toggleClass('icon_close_default3x').toggleClass('icon_shaixuan_default3x');*/
                });

                var myScrollX;
                //var i = $(".mall_list_tab");
               
                $(".mall_list_tab li").on("click",function(){
                	
                    $(this).addClass("sort_tab_active").siblings().removeClass('sort_tab_active');
                });
                //滑动导航
                myScrollX = new IScroll('#wrapper_list', { eventPassthrough: true, scrollX: true, scrollY: false, preventDefault: false });
            });

             $('.city').click(function(){
                city_id=$(this).attr('cityid');
                 chooseCityName(city_id);
             })

             function chooseCityName(objId){
             		var city_id = objId;
                    $.ajax({
                        url:'/FrontIncubator/async_get_zckj_list',
                        type:"post",
                        dataType:"json",
                        data:{'city_id':city_id,'key_words':key_words},
                        success:function(data){
                            console.log(data);
                            total=data.total;
                            num=1;
                            if(total<=firstRow)
                            {
                                $(".pullUpIcon").hide();
                                $(".pullUpLabel").html("没有更多了");
                            }
                            if(data.code==1){
                                var len=data.data.length;
                                var i=0;
                                var html='';
                                for(i=0;i<len;i++){
                                    html+='<li>'+
                                            '<a href="/FrontIncubator/zhongchuang_detail/incubator_id/'+data.data[i].incubator_id+'">'+
                                            '<img src="'+data.data[i].first_pic+'" alt="" />'+
                                            '<div class="park_number clearfix">'+
                                            '<h6 class="fl">'+data.data[i].incubator_name+'</h6>'+
                                            '<span class="fr">'+data.data[i].station_left_num +'个</span>'+
                                            '<p class="fr">剩余量：</p>'+
                                            '</div>'+
                                            '<p class="txt_limit">'+data.data[i].address+'</p>'+
                                            '</a>'+
                                            '</li>';
                                }
                                $('.park_list').html(html);
                                setTimeout(function(){
						            myScroll.refresh();
						        },500);
                            }else{
                                $('.park_list').html();
                            }
                        }
                    })
             }
            
        </script>
<script src="__PUBLIC__/Js/front/front_js/zhongchaung_list.js" type="text/javascript" charset="utf-8"></script>
{/literal}
{/block}
